<template>
	<el-col :span="componentModel.col*6">
		<el-row>
			<el-col :span="8" class="field-label-div" v-if="!componentModel.noLabel">
				<label class="field-label">{{componentModel.label}}</label>
			</el-col>
			<el-col :span="componentModel.fieldcol">
				<div class="el-select el-select--mini" @click="onClickHandler" v-show="visible">
					<div class="el-input el-input--mini el-input--suffix">
						<input type="text" readonly="readonly" autocomplete="off" placeholder="请选择"
							class="el-input__inner" v-model="v_text_model">
						<span class="el-input__suffix"><span class="el-input__suffix-inner"><i
									class="el-input__icon el-icon-search"></i>
							</span>
						</span>
					</div>
					<input type="hidden" v-model="v_value_model" />
				</div>
			</el-col>
		</el-row>
		<el-dialog title="属性集实例" v-model="previewDialogVisible" width="35%" :append-to-body="true">
			<el-row v-for="item in attributeList" :key="item.attributeId" style="margin-top: 10px;">
				<el-col :span="8">{{item.label}}</el-col>
				<el-col :span="16">
					<el-select v-if="item.type=='list'" size="mini" v-model="item.value" :disabled="attributeReadonly">
						<el-option v-for="childItem in item.optionList" :key="childItem.value" :label="childItem.name"
							:value="childItem.value">
						</el-option>
					</el-select>
					<el-input size="mini" v-model="item.value" v-else-if="item.type=='string'" :readonly="attributeReadonly"/>
					<el-input size="mini" v-model="item.value" v-else-if="item.type=='number'" type="number" :readonly="attributeReadonly"/>
				</el-col>
			</el-row>
			<el-row v-if="lot==true" style="margin-top: 10px;">
				<el-col :span="8">批次</el-col>
				<el-col :span="16"><el-input  size="mini" v-model="lotValue"/></el-col>
			</el-row>
			<el-row v-if="serNo==true" style="margin-top: 10px;">
				<el-col :span="8">序列号</el-col>
				<el-col :span="16"><el-input  size="mini" v-model="serNoValue"/></el-col>
			</el-row>
			<template #footer>
				<span class="dialog-footer">
					<el-button type="primary" @click="onDataSave" size="small">确定</el-button>
				</span>
			</template>
		</el-dialog>
	</el-col>
</template>

<script>
	import {
		sendComponentValueChangeRequest,
		sendComponentEventRequest
	} from '@/utils/requestUtils.js';
	import {
		getPageData
	} from '@/utils/pageUtils.js';
	import constants from '@/utils/constants.js';
	import utils from '@/utils/utils.js';
	export default {
		name: "AttributeSetInstanceComponent",
		components: {

		},
		props: ["componentModel", "scope"],
		data() {
			return {
				v_text_model: "",
				v_value_model: "",
				datamodel: {},
				visible: true,
				readonly: false,
				label: "",
				previewDialogVisible: false,
				attributeList: [],
				lotValue:"",
				serNoValue:"",
				lot:false,
				serNo:false,
				attributeReadonly:false
			}
		},
		inject: ['children'],
		mounted() {
			this.children.push(this);
		},
		methods: {
			setProp(prop) {
				var dataModel = prop["options"];
				if (dataModel != undefined) {
					this.datamodel = dataModel;
				}
				for (var k in prop) {
					if (k == "value") {
						this.v_value_model = prop[k];
						var isExists = false;
						for (var i = 0; i < this.datamodel.length; i++) {
							if (this.datamodel[i].value == this.v_value_model) {
								this.v_text_model = this.datamodel[i].name;
								isExists = true;
								break;
							}
						}
						if (!isExists) {
							this.v_text_model = "";
						}
					} else if (k == "visible") {
						this.visible = prop[k];
					} else if (k == "readonly") {
						this.readonly = prop[k];
					} else if (k == "label") {
						this.label = prop[k];
					}
				}
			},
			onClickHandler() {
				if (this.readonly) {
					return;
				}
				var pageComponent = utils.getPageComponent(this);
				var pageCode = pageComponent.componentModel.code;
				if ("product_product_formview" == pageCode) {
					var data = getPageData(pageComponent, this.children);
					var productAttributeSetId = data["product_attribute_set_id"];
					var productProductId = data["id"];
					if (productAttributeSetId == null) {
						return;
					}
				}else{
					this.attributeReadonly=true;
					var id=this.componentModel.id;
					var index=id.substring(id.indexOf("_et")+3);
					data=this.getTableRowData(index);
					productProductId=data["product_product_id"];
					productAttributeSetId="";
				}
				var that = this;
				this.axios.get(constants.ROOT_URL + "attributesetinstance/init?pageCode=" +
						pageComponent.componentModel.code + "&productAttributeSetId=" + productAttributeSetId +
						"&productProductId=" + productProductId + "&productAttributeSetInstanceId=" + this.getValue())
					.then(
						function(response) {
							if (response.data.code == 1) {
								that.attributeList = response.data.attributeDTOList;
								that.lot=response.data.lot;
								that.serNo=response.data.serNo;
								that.lotValue=response.data.lotValue;
								that.serNoValue=response.data.serNoValue;
							} else {
								that.$alert(response.data.message, '提示')
							}
						});

				this.previewDialogVisible = true;
			},
			searchCallback(value, name) {
				if (value == null) {
					this.v_value_model = "";
				} else {
					this.v_value_model = value;
				}
				this.v_text_model = name;
				if (this.scope != undefined) {
					this.$emit("onValueChange", this);
					return;
				}
				sendComponentValueChangeRequest(this);
			},
			setSelectedValue(value) {
				sendComponentEventRequest(this, "searchValueDisplayEvent", {
					"value": value
				});
			},
			getValue() {
				return this.v_value_model == null ? "" : this.v_value_model;
			},
			onDataSave() {
				var pageComponent = utils.getPageComponent(this);
				var pageCode = pageComponent.componentModel.code;
				if ("product_product_formview" == pageCode) {
					var data = getPageData(pageComponent, this.children);
					var productAttributeSetId = data["product_attribute_set_id"];
					var productProductId = data["id"];
				}else{
					var id=this.componentModel.id;
					var index=id.substring(id.indexOf("_et")+3);
					data=this.getTableRowData(index);
					productProductId=data["product_product_id"];
					productAttributeSetId="";
				}
				var p = "";
				for (var i = 0; i < this.attributeList.length; i++) {
					p += "&" + this.attributeList[i].attributeId + "=" + this.attributeList[i].value;
				}
				if(this.lot){
					p+="&lotValue="+this.lotValue;
				}
				if(this.serNo){
					p+="&serNoValue="+this.serNoValue;
				}
				var that = this;
				this.axios.post(constants.ROOT_URL + "attributesetinstance/dataSave?pageCode=" +
						pageComponent.componentModel.code + "&productAttributeSetId=" + productAttributeSetId +
						"&productProductId=" + productProductId + "&productAttributeSetInstanceId=" + this.getValue() + p)
					.then(
						function(response) {
							if (response.data.code == 1) {
								that.v_value_model = response.data.attributeSetInstanceId;
								that.v_text_model = response.data.description;
							} else {
								that.$alert(response.data.message, '提示')
							}
							that.previewDialogVisible = false;
						});
			},getTableRowData(index){
				var data = {};
				for (var i = 0; i < this.children.length; i++) {
					if (this.children[i].componentModel == undefined) continue;
					if (utils.endsWith(this.children[i].componentModel.id,"_et"+index)) {
						if (this.children[i]["getValue"] != undefined) {
							var value = this.children[i]["getValue"]();
							if (value != undefined) {
								data[this.children[i].componentModel.dataField] = value;
							}
						}
					}
				}
				return data;
			}
		},
	}
</script>

<style>
</style>
